<template>
    <div>
        <router-link to="/login" id="toLogin"></router-link>
        <top-bar title="我的客户"></top-bar>
        <cus-top :data="data"></cus-top>
        <cus-list @cusButtonChange="buttonChange" :data="data" :is_effective='is_effective' @isPopChange="isPopChange" :month="month"></cus-list>
        
        <pop-time-chioce @year="yearChange" @month="monthChange" v-if="isPop" @isPop1="req" @isPop="none" :year1="year" :month1="month"></pop-time-chioce>
    </div>
</template>

<script>
    import request from '@/request/index.js'
    import topBar from '@/components/common/topBar1.vue'
    import cusTop from '@/components/customer/cusTop.vue'
    import cusList from '@/components/customer/cusList.vue'
    import popTimeChioce from '@/components/common/popTimeChioce.vue'
    export default {
        name: "home",
        components:{
            topBar,
            cusTop,
            cusList,
            popTimeChioce,
        },
        data() {
            return {
                token:'',
                is_effective:1,
                months:'',
                data:{},
                month:'',
                year:'',
                isPop:false
            };
        },
        methods:{
            buttonChange:function(val){
                this.is_effective=val;
                request.getCustomer(this);
            },
            isPopChange:function(val){
                this.isPop=val;
            },
            yearChange:function(val){
                this.year=val;
            },
            monthChange:function(val){
                this.month=val;
            },
            none:function(){
                this.isPop=false;
            },
            req:function(){
                this.isPop=false;
                request.getCustomer(this);
            }
        },
        watch:{
            is_effective(newVal,oldVal){
　　　　　　},
        },
        created(){
        },
        mounted(){
            const loading = this.$loading({
                // ...options
                color:'#55A9FF',
                overlayColor:'rgba(0,0,0,.5)',
                className: 'loadingStyle',
            });
                if(this.$route.query.token){
                this.$cookie.set('token',this.$route.query.token,7);
                this.token=this.$cookie.get('token');
            }else{
                if(this.$cookie.get('token')){
                    this.token=this.$cookie.get('token');
                }
                else{
                    document.getElementById('toLogin').click();
                }
            }
                var date=new Date;
                this.year=date.getFullYear(); 
                this.month=date.getMonth()+1;
                request.getCustomer(this,loading);
        }
    }
</script>

<style scoped lang="scss">

</style>
